<!DOCTYPE html>
<html
  layout:decorator="components/layout"
  xmlns="http://www.w3.org/1999/xhtml"
  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
  xmlns:th="http://www.thymeleaf.org"
>
<head>
  <title>活跃域名</title>
</head>
<body>
<div
  layout:fragment="content"
  id="app" v-cloak
>
  <div class="container">

    <div class="myHeader">
      <div class="myHeader-title">
        活跃域名
      </div>
      <div class="myHeader-tool">

        <el-button type="primary" size="mini" icon="el-icon-search" @click="toggle">高级搜索</el-button>

        &nbsp;
        所在机房:
        <el-select v-model="form.houseId" @change="searchPage" placeholder="请选择" size="mini" clearable>
          <el-option v-for="position in positions" :label="position.houseName" :key="position.id" :value="position.id">
          </el-option>
        </el-select>

      </div>
    </div>

    <el-row>
      <el-form label-width="100px" class="container-search" v-show="formShow">
        <el-row :gutter="10">
          <el-col :span="9">
            <el-form-item label="顶级域名:">
              <el-input
                v-model="form.topDomain"
                clearable
                show-word-limit
                maxlength="64"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="3">
            <el-form-item label-width="0">
              <rx-search-action
                v-model="form.topDomainAction"
              ></rx-search-action>
            </el-form-item>
          </el-col>

          <el-col :span="9">
            <el-form-item label="子域名:">
              <el-input
                v-model="form.findDomainListDomain"
                clearable
                show-word-limit
                maxlength="30"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="3">
            <el-form-item label-width="0">
              <rx-search-action
                v-model="form.domainAction"
              ></rx-search-action>
            </el-form-item>
          </el-col>

          <el-col :span="9">
            <el-form-item label="应用IP:">
              <el-input
                v-model="form.ip"
                clearable
                show-word-limit
                maxlength="30"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="3">
            <el-form-item label-width="0">
              <rx-search-action
                v-model="form.ipAction"
              ></rx-search-action>
            </el-form-item>
          </el-col>

          <el-col :span="9">
            <el-form-item label="备案号:">
              <el-input
                v-model="form.recordNumber"
                clearable
                show-word-limit
                maxlength="30"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="3">
            <el-form-item label-width="0">
              <rx-search-action
                v-model="form.recordNumberAction"
              ></rx-search-action>
            </el-form-item>
          </el-col>


          <el-col :span="12">
            <el-form-item label="首次采集时间:">
              <el-date-picker
                v-model="form.timeArray1"
                @change="changeFirstTime"
                type="daterange"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                :default-time="['00:00:00', '23:59:59']"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="最后活跃时间:">
              <el-date-picker
                v-model="form.timeArray2"
                @change="changeLastTime"
                type="daterange"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                :default-time="['00:00:00', '23:59:59']"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>

        </el-row>

        <div style="text-align:center; margin-bottom:20px">
          <el-button type="primary" size="medium" @click="searchPage">查 找</el-button>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <el-button type="primary" size="medium" @click="resetPage">重 置</el-button>
        </div>
      </el-form>
    </el-row>

    <div>
      <template>
        <my-table
          :data="page.records"
          :columns="columns"
          @handle-selection-change="selection"
        >
        </my-table>
        <div class="pagination">
          <el-pagination
            background
            @size-change="changeSize"
            @current-change="goto"
            :current-page="page.current"
            :page-sizes="[10, 20, 30]"
            :page-size="page.size"
            layout="total, sizes, prev, pager, next, jumper"
            :total="page.total"
          >
          </el-pagination>
          <div class="pagination-tool">
            <el-button
              type="primary"
              size="mini"
              @click="reportShow"
              v-realm="'regulatory-log:slog-hot-domain:edit'"
            >域名上报
            </el-button>
            <el-button
              type="primary"
              size="mini"
              @click="exportFile"
              v-realm="'regulatory-log:slog-hot-domain'"
            >导出
            </el-button>
            <el-button
              type="danger"
              size="mini"
              @click="deleteSelected"
              v-realm="'regulatory-log:slog-hot-domain:edit'"
            >批量删除
            </el-button>
          </div>
        </div>

      </template>


      <el-dialog
        title="活跃域名上报"
        :visible.sync="isreportShow"
      >
        <table
          width="100%"
          border="1"
          cellpadding="0"
          cellspacing="0"
          class="digest-table"
        >
          <tbody>
          <tr>
            <td class="TitleTD">活跃域名总数</td>
            <td class="ContentTD">{{reportNum}}</td>
          </tr>
          <tr>
            <td class="TitleTD">上报数据</td>
            <td class="ContentTD">完整上报</td>
          </tr>
          <tr>
            <td class="TitleTD">执行描述</td>
            <td class="ContentTD"><textarea
              name="msgInfo"
              cols="39"
              v-model="msgInfo"
            >{{ msgInfo }}</textarea></td>
          </tr>
          </tbody>
        </table>

        <div
          slot="footer"
          class="dialog-footer"
        >
          <el-button @click="resetReport">重置</el-button>
          <el-button
            type="primary"
            @click="report"
            v-realm="'regulatory-log:slog-hot-domain:edit'"
          >确 定
          </el-button>
        </div>
      </el-dialog>


    </div>

  </div>

</div>
<div layout:fragment="js">
  <script src="/static/js/module/slog/model/HotDomain.js"></script>
  <script src="/static/js/module/slog/api/slogHotDomainApi.js"></script>
  <script src="/static/js/module/basic-data/api/baseHouseInfoApi.js"></script>
  <script src="/static/js/module/slog/admin_active_domain.js"></script>
</div>
</body>
</html>
